window.onload = function () {
    var inputData = [];
    function initCharts (data,key){
        var par={}
        if(data.length==0){
            par={"type":key}
        }else{
            data.type=key
            par=data
        }
        $.ajax({
            type: "POST",
            url: "/analyze/areaData",
            data:par,
            success: function (msg){
                var myChart = echarts.init($('#myChart4').get(0));
                var cData=msg.result
                option4 = {
                    tooltip : {
                        trigger: 'item'
                    },
                    title: [{
                        subtext: '押品数量',
                        left: '1%',
                        top: '3%',
                        textStyle: {
                            color: '#333'
                        }
                    }, {
                        subtext: '',
                        left: '83%',
                        top: '6%',
                        textAlign: 'center',
                        textStyle: {
                            color: '#ff733f'
                        }
                    }],
                    grid: {
                        left: '1%',
                        right: '35%',
                        top: '16%',
                        bottom: '6%',
                        containLabel: true
                    },
                    yAxis:  {
                        type: 'value',
                        axisLine:{
                            lineStyle:{
                                color:'#ADADAD',
                            }
                        },
                    },
                    xAxis: {
                        type: 'category',
                        axisLabel: {
                            interval: 0,
                            rotate: 0
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#ADADAD',
                            }
                        },
                        data : []
                    },
                    series: [
                        {
                            name:'数量',
                            type:'bar',
                            data:[],
                            tooltip : {
                                axisPointer : {            // 坐标轴指示器，坐标轴触发有效
                                    type : 'line'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            itemStyle: {
                                normal: {
                                    color: function(params) {
                                        // build a color map as your need.
                                        var colorList = [
                                            '#C1232B','#B5C334','#FCCE10','#E87C25','#27727B',
                                            '#FE8463','#9BCA63','#FAD860','#F3A43B','#60C0DD',
                                            '#D7504B','#C6E579','#F4E001','#F0805A','#26C0C0'
                                        ];
                                        return colorList[params.dataIndex]
                                    },label: {
                                        show: true,
                                        position: 'top',
                                        formatter: '{c}'
                                    }
                                }
                            }
                        },
                        {
                            type: 'pie',
                            center: ['83%', '53%'],
                            radius : '40%',
                            data:[],
                            tooltip : {
                                formatter: "{a} <br/>{b} : {c} ({d}%)"
                            },
                            itemStyle: {
                                normal: {
                                    color: function(params) {
                                        var colorList = [
                                            '#C1232B','#B5C334','#FCCE10','#E87C25','#27727B',
                                            '#FE8463','#9BCA63','#FAD860','#F3A43B','#60C0DD',
                                            '#D7504B','#C6E579','#F4E001','#F0805A','#26C0C0'
                                        ];
                                        return colorList[params.dataIndex]
                                    },
                                    label: {
                                        show: true,
                                        position: 'top',
                                        formatter: '{b}'
                                    }
                                }
                            }
                        }



                    ]
                };

                    var xData = [];
                    var series1 = [];
                    var ydata=[]
                    if(key==1){
                        for (var i = 0; i < cData['estateResult'].length; i++) {
                            xData.push(cData['estateResult'][i]['cityName'])
                            series1.push(cData['estateResult'][i]['value'])
                            ydata.push({name:cData['estateResult'][i]['cityName'],value:cData['estateResult'][i]['value']})
                        }
                        option4.xAxis.data=xData;
                        option4.series[0].data=series1
                        option4.series[1].data=ydata
                        option4.series[0].name='押品数量';
                        option4.series[1].name='押品数量';
                        option4.title[0].subtext="押品数量（笔）"

                    }
                    else if (key == 2) {
                        for (var i = 0; i < cData['loansAmountResult'].length; i++) {
                            xData.push(cData['loansAmountResult'][i]['cityName'])
                            series1.push(transitiony(cData['loansAmountResult'][i]['value']))
                            ydata.push({name:cData['loansAmountResult'][i]['cityName'],value:transitiony(cData['loansAmountResult'][i]['value'])})
                        }
                        option4.xAxis.data=xData;
                        option4.series[0].data=series1;
                        option4.series[1].data=ydata;
                        option4.series[0].name='贷款金额';
                        option4.series[1].name='贷款金额';
                        option4.title[0].subtext="贷款金额（亿元）"
                    }
                    else if (key == 3) {
                        for (var i = 0; i < cData['loansBalanceResult'].length; i++) {
                            xData.push(cData['loansBalanceResult'][i]['cityName'])
                            series1.push(transitiony(cData['loansBalanceResult'][i]['value']))
                            ydata.push({name:cData['loansBalanceResult'][i]['cityName'],value:transitiony(cData['loansBalanceResult'][i]['value'])})
                        }
                        option4.xAxis.data=xData
                        option4.series[0].data=series1;
                        option4.series[1].data=ydata;
                        option4.series[0].name='贷款余额';
                        option4.series[1].name='贷款余额';
                        option4.title[0].subtext="贷款余额（亿元）"
;
                    }  else if (key == 4) {
                        for (var i = 0; i < cData['ltvResult'].length; i++) {
                            xData.push(cData['ltvResult'][i]['cityName'])
                            series1.push((cData['ltvResult'][i]['value']*100).toFixed(2))
                            ydata.push({name:cData['ltvResult'][i]['cityName'],value:(cData['ltvResult'][i]['value']*100).toFixed(2)})
                        }
                        // var min=Math.min.apply(null,series1);
                        option4.xAxis.data=xData
                        option4.series[0].data=series1
                        option4.series[1].data=ydata
                        option4.series[0].name='动态抵押率';
                        option4.series[1].name='动态抵押率';
                        option4.title[0].subtext="动态抵押率（%）";
                        // option4.yAxis.splitNumber='10';
                        // option4.yAxis.min='60';
                        // option4.yAxis.max='70';
                    }
                if(xData.length>10){
                    option4.xAxis.axisLabel. rotate = 30
                }
                myChart.setOption(option4);
                window.onresize = function () {
                    myChart.resize()
                };
            }
        })}
    initCharts(inputData,1);
    $('#searchData').click(function(){
        // $('#one').siblings().removeClass('active');
        //  $('#one').addClass('active');
            citys = $('#city').val(),
            loansBalanceStarts = $('#loansBalanceStart').val(),
            loansBalanceEnds =  $('#loansBalanceEnd').val(),
            loansAmountStarts = $('#loansAmountStart').val(),
            loansAmountEnds = $('#loansAmountEnd').val(),
            startDateStarts = $('#startDateStart').val(),
            startDateEnds = $('#startDateEnd').val(),
            loansDurations = $('#loansDuration').val(),
                risk = $('#risk').val(),
            dynamicMortgageRateStarts = $('#dynamicMortgageRateStart').val(),
            dynamicMortgageRateEnds = $('#dynamicMortgageRateEnd').val(),
            buildAreaEnds = $('#buildAreaEnd').val(),
            buildAreaStarts = $('#buildAreaStart').val(),
            endDateStarts = $('#endDateStart').val(),
            endDateEnds = $('#endDateEnd').val(),
            inputData = {
                city:citys,
                loansBalanceStart:loansBalanceStarts,
                loansBalanceEnd:loansBalanceEnds,
                loansAmountStart:loansAmountStarts,
                loansAmountEnd:loansAmountEnds,
                startDateStart:startDateStarts,
                startDateEnd:startDateEnds,
                loansDuration:loansDurations,
                risk:risk,
                dynamicMortgageRateStart:dynamicMortgageRateStarts,
                dynamicMortgageRateEnd:dynamicMortgageRateEnds,
                buildAreaEnd:buildAreaEnds,
                buildAreaStart:buildAreaStarts,
                endDateStart:endDateStarts,
                endDateEnd:endDateEnds
            };

            if($("#one").hasClass("active")){
                initCharts(inputData,1)
            }else if($('#two').hasClass("active")){
                initCharts(inputData,2)
            }else if($('#three').hasClass("active")){
                initCharts(inputData,3)
            }else if($('#four').hasClass("active")){
                initCharts(inputData,4)
            };

    });
    $('#one').click(function(){
        initCharts(inputData,1);
    });
    $('#two').click(function(){
        initCharts(inputData,2);
    });
    $('#three').click(function(){
        initCharts(inputData,3);
    });
    $('#four').click(function(){
        initCharts(inputData,4);
    });
}